<template>
    <el-select v-model="currentVal" placeholder="请选择" :disabled="disabled" :clearable="clearable"
               :multiple='multiple' :placeholder="placeholder">
        <el-option
                v-for="item in opts"
                :key="item.value"
                :label="item.label"
                :value="item.value">
        </el-option>
    </el-select>
</template>

<script>
    /**
     * 开关选择器：【可用/不可用】、【可行/不可行】、【启动/禁用】 <br>
     * <xy-switch-select></xy-switch-select>
     * <xy-switch-select :options="['可行','不可行']"></xy-switch-select>
     * <xy-switch-select :options="[{ value: true,label:'开启'},{ value: false,label:'关闭'}]"></xy-switch-select>
     * <xy-switch-select :options="[{ value: true,label:'成功'},'失败']"></xy-switch-select>
     * @author Canaan
     * @date 2019/3/14 9:57.
     */
    export default {
        name: 'SwitchSelect',
        mounted() {

        },
        components: {},
        props: {
            multiple: {
                default: false,
            },
            clearable: {
                default: true
            },
            placeholder: {
                default: '请选择产品'
            },
            disabled: {
                default: false
            },
            value: undefined,
            options: {
                type: Array,
                default() {
                    return ['可用', '不可用'];
                }
            }
        },
        data() {
            return {
                currentVal: this.value
            }
        },
        computed: {
            opts() {
                let arr = [];
                if (this.options && this.options.length === 2) {
                    if (typeof this.options[0] === 'string') {
                        arr.push({
                            value: true,
                            label: this.options[0]
                        });
                    } else {
                        arr.push(this.options[0]);
                    }
                    if (typeof this.options[1] === 'string') {
                        arr.push({
                            value: false,
                            label: this.options[1]
                        });
                    } else {
                        arr.push(this.options[1]);
                    }

                }

                return arr;
            }
        },
        methods: {},
        watch: {
            currentVal(val) {
                this.$emit("input", val);
            },
            value(val) {
                this.currentVal = val;
            }
        },
        filters: {},
        beforeDestroy() {

        }
    }
</script>

<style scoped>

</style>